Creating an object with a parameters form

Creating an object with a parameters form

When you select some objects (for example, an image or a Shockwave Director 6 object) from the Objects palette or Insert menu, a dialog box appears that lets you assign the object parameters. These dialog boxes are created within the object files using HTML forms and JavaScript. To create an object with a parameters form, you must be proficient at scripting with JavaScript.

To create an object with a parameters form:

1 Open an existing object that uses a parameters form (for example, image.htm) in Dreamweaver and choose File > Save As to save the file with another file name.

If you want the new object to appear on one of the existing panels, save it in one of the Objects subdirectories (Common, Forms, or Invisibles). If you want to create a new panel, create a new folder inside the Objects directory and save your file there. Additional subdirectories inside any Objects subdirectory are ignored.

2 Choose Window > HTML to open the HTML inspector.

Click in the HTML inspector to activate it, or click the External Editor (Windows) or BBEdit (Macintosh) button to work in your favorite text editor.

3 Change the TITLE to reflect the object's function.

For example, if your new object inserts an instance of "MyTag," change the TITLE to "Insert MyTag."

4 Replace the tags in the objectTag() function's return statement with the tag or tags you want to insert. For example:

return '<MYTAG SRC="">'

5 In the body of the document, create a form that captures parameters for your tag or tags. For example:

<BODY> <FORM> <TABLE> <TR> <TD NOWRAP> MyTag Source:<BR> <INPUT TYPE="text" NAME="mytagfile" SIZE="24"> <INPUT TYPE="button" VALUE="Browse..." onClick="browseFile()"></TD> </TR> </TABLE> </FORM> </BODY>

The minimum size of the dialog box is 200 pixels by 50 pixels, and the maximum size is 640 pixels by 480 pixels. The form contents wrap to 200 pixels wide unless an image or table forces the dialog box wider. Therefore, to ensure that two items (such as an input field and a Browse button) remain on the same line, put the line in a table cell with wrapping disabled, as in the example above.

If you need a Browse button in your parameters form, include the browseFile() function in your object file (you can copy it from the Image object file). browseFile() calls the browseForFileURL() function, which is built into Dreamweaver.

6 Insert the form data into the tags in the objectTag() function, using JavaScript string concatenation syntax. For example:

return '<MYTAG SRC="' + document.form[0].mytagfile.value + '">'

7 Save the file.

8 Open InsertMenu.htm in Dreamweaver.

9 Place your cursor at the end of the line above where you want your new object to appear in the Insert menu.

For example, if you want your new object to appear after Line Break, place your cursor directly after line_break.htm.

10 Hit enter to create a new list item, then type the name of your object, the letter, number, or symbol that you would like to use as a keyboard shortcut, and the filename of your object.

For example,

· MyTag, Y, mytag.htm

Windows only: Highlight the letter you would like to use as a mnemonic and choose Text > Style > Underline.

11 Optional: Hit enter to create a new list item, then type one or more hyphens to create a separator line between your object and the previous object in the menu.

12 Save the file and quit Dreamweaver.

13 In a graphics or image-editing program (such as FreeHand or Adobe® Photoshop®), create a 16-pixel by 16-pixel GIF that will serve as the icon for your object in the Objects palette.

If you create a larger image, Dreamweaver automatically scales it to 16 pixels by 16 pixels. If you do not create an icon for your object, Dreamweaver inserts a default icon in the Objects palette.

1	Open an existing object that uses a parameters form (for example, image.htm) in Dreamweaver and choose File > Save As to save the file with another file name.
	If you want the new object to appear on one of the existing panels, save it in one of the Objects subdirectories (Common, Forms, or Invisibles). If you want to create a new panel, create a new folder inside the Objects directory and save your file there. Additional subdirectories inside any Objects subdirectory are ignored.
2	Choose Window > HTML to open the HTML inspector.
	Click in the HTML inspector to activate it, or click the External Editor (Windows) or BBEdit (Macintosh) button to work in your favorite text editor.
3	Change the TITLE to reflect the object's function.
	For example, if your new object inserts an instance of "MyTag," change the `TITLE` to "Insert MyTag."
4	Replace the tags in the objectTag() function's return statement with the tag or tags you want to insert. For example:
	return '<MYTAG SRC="">'
5	In the body of the document, create a form that captures parameters for your tag or tags. For example:
	<BODY> <FORM> <TABLE> <TR> <TD NOWRAP> MyTag Source:<BR> <INPUT TYPE="text" NAME="mytagfile" SIZE="24"> <INPUT TYPE="button" VALUE="Browse..." onClick="browseFile()"></TD> </TR> </TABLE> </FORM> </BODY>
	The minimum size of the dialog box is 200 pixels by 50 pixels, and the maximum size is 640 pixels by 480 pixels. The form contents wrap to 200 pixels wide unless an image or table forces the dialog box wider. Therefore, to ensure that two items (such as an input field and a Browse button) remain on the same line, put the line in a table cell with wrapping disabled, as in the example above.
	If you need a Browse button in your parameters form, include the `browseFile()` function in your object file (you can copy it from the Image object file). `browseFile()` calls the `browseForFileURL()` function, which is built into Dreamweaver.
6	Insert the form data into the tags in the objectTag() function, using JavaScript string concatenation syntax. For example:
	return '<MYTAG SRC="' + document.form[0].mytagfile.value + '">'
7	Save the file.
8	Open InsertMenu.htm in Dreamweaver.
9	Place your cursor at the end of the line above where you want your new object to appear in the Insert menu.
	For example, if you want your new object to appear after Line Break, place your cursor directly after `line_break.htm.`
10	Hit enter to create a new list item, then type the name of your object, the letter, number, or symbol that you would like to use as a keyboard shortcut, and the filename of your object.
	For example,
	· MyTag, Y, mytag.htm
	Windows only: Highlight the letter you would like to use as a mnemonic and choose Text > Style > Underline.
11	Optional: Hit enter to create a new list item, then type one or more hyphens to create a separator line between your object and the previous object in the menu.
12	Save the file and quit Dreamweaver.
13	In a graphics or image-editing program (such as FreeHand or Adobe® Photoshop®), create a 16-pixel by 16-pixel GIF that will serve as the icon for your object in the Objects palette.
	If you create a larger image, Dreamweaver automatically scales it to 16 pixels by 16 pixels. If you do not create an icon for your object, Dreamweaver inserts a default icon in the Objects palette.